<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>导航条</title>
	<style>
		.nav {
			text-align: center;
		}

		.nav a{
			width: 120px;
			height: 50px;
			/*background-color: pink;*/
			display: inline-block;
			
			text-decoration: none;
			line-height: 50px;
			color: #fff;

			background: url(images/bg.png) no-repeat;
		}

		/*鼠标移动*/
		.nav a:hover {
			background: url(images/bgc.png) no-repeat;
		}


		.demo{
			/*最后一个参数代表透明度 RGB。 0-1之间*/  
			background: rgba(0, 0, 0, 0.3);				
		}
	</style>
</head>
<body>
	<div class="nav">
		<a href="#">网站首页</a>
		<a href="#">网站首页</a>
		<a href="#">网站首页</a>
		<a href="#">网站首页</a>
		<a href="#">网站首页</a> 
		<a href="#">网站首页</a>
	</div>
	<div class="demo">
		
	</div>
</body>
</html>